<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>招募详情</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
        content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="stylesheet" href="../css/font.css">
    <link rel="stylesheet" href="../css/iconfont.css">
    <link rel="stylesheet" href="../lib/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="../css/style.css">
    <link rel="stylesheet" href="../css/xadmin.css">
    <script src="../lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="../js/xadmin.js"></script>
    <script src="../js/base.js"></script>
    <script src="../js/vue.min.js"></script>
    <style>
        tr td,
        tr th {
            text-align: center !important;
            border: none !important;
        }

        .layui-laydate-content tr td {
            border-bottom: none !important;
            border-top: none !important;
        }

        tr td {
            border-bottom: 1px solid #eee !important;
            border-top: 1px solid #eee !important;
        }

        .shaixuan .layui-col-md12 .layui-inline {
            margin: 0;
        }

        .shaixuan .layui-col-md12 .layui-inline.layui-col-md3 .layui-form-label {
            width: 30%;
            padding-left: 0;
        }

        .shaixuan .layui-col-md12 .layui-inline.layui-col-md3 .layui-input-inline {
            width: 53%;
        }

        .rotate {
            transform-origin: center center;
            transform: rotate(180deg);
            -webkit-transform: rotate(180deg);
            -moz-transform: rotate(180deg);
            -ms-transform: rotate(180deg);
            -o-transform: rotate(180deg);
            transition: transform 0.2s;
            -moz-transition: -moz-transform 0.2s;
            -moz-transition: -moz-transform 0.2s;
            -o-transition: -o-transform 0.2s;
            -ms-transition: -ms-transform 0.2s;
        }

        .rotate1 {
            transform-origin: center center;
            transform: rotate(0deg);
            -webkit-transform: rotate(0deg);
            -moz-transform: rotate(deg);
            -ms-transform: rotate(0deg);
            -o-transform: rotate(0deg);
            transition: transform 0.2s;
            -moz-transition: -moz-transform 0.2s;
            -moz-transition: -moz-transform 0.2s;
            -o-transition: -o-transform 0.2s;
            -ms-transition: -ms-transform 0.2s;
        }

        body {
            background: #fff;
        }
    </style>
</head>

<body>
    <div class="layui-fluid" id="approveTeam">
        <div class="title">赛事基本信息</div>
        <input id="id" data-id="" type="hidden">
        <div class="borders">
            <ul>
                <li>
                    <h2>赛事名称：</h2>
                    <p class="name"></p>
                </li>
                <li>
                    <h2>对战人数：</h2>
                    <p class="vsPerNum"></p>
                </li>
                <li>
                    <h2>起止时间：</h2>
                    <p><span class="competitionStartTime"></span> 至 <span class="competitionEndTime"></span></p>
                </li>
                <li>
                    <h2>赛制规则：</h2>
                    <p class="rules"></p>
                </li>
                <li>
                    <h2>主办地：</h2>
                    <p class="province"></p>
                </li>
            </ul>
        </div>
        <div class="title">待审核球队</div>
        <div class="layui-card-body layui-table-body layui-table-main">
            <!-- 表格部分开始 -->
            <table id="teamTable" lay-filter="test" lay-data="{id: 'testReload'}"></table>
            <script type="text/html" id="barDemo2">
                {{# if(d.teamApplyStatus == 0){ }}
                    <a class="layui-btn layui-btn-primary layui-btn-xs">已拒绝</a>
                {{# } else if(d.teamApplyStatus == 1){ }}
                    <a lay-event="approve" class="layui-btn layui-btn-xs">审核</a>
                {{# } else if(d.teamApplyStatus == 3){ }}
                    <a lay-event="confirmPay" class="layui-btn layui-btn-primary layui-btn-xs">确认缴费</a>
                {{# }}}
            </script>
            <!-- 表格结束 -->
        </div>
    </div>
</body>

</html>
<script>

    layui.use(['table', 'form'], function () {
        var table = layui.table;
        var form = layui.form;
        // var laydate = layui.laydate;
        var index = layer.load(1); //添加laoding,0-2两种方式
        //第一个实例
        table.render({
            elem: '#teamTable', //指定原始表格元素选择器（推荐id选择器）
            // height: 600,
            toolbar: true,
            defaultToolbar: ['exports', {
                title: '提示' //标题
                ,
                layEvent: 'LAYTABLE_TIPS' //事件名，用于 toolbar 事件中使用
                ,
                icon: 'layui-icon-tips' //图标类名
            }],
            width: "100%",
            where: {
                competitionId: $("#id").attr("data-id")
            },
            loading: true,
            method: 'get',
            url: teamApplyAuditList, //数据接口
            page: true, //开启分页
            // toolbar: 'default', //开启工具栏，此处显示默认图标
            limit: 10,
            limits: [10, 20, 30, 50, 100, 500, 1000, 5000, 10000],
            cols: [
                [
                    {
                        field: 'name',
                        title: '球队名称',
                        width: 150
                    },
                    {
                        field: 'teamApplyStatus',
                        title: '审核状态',
                        width: 150,
                        templet: function (d) {
                            if (d.teamApplyStatus == 1) {
                                return '待审核'
                            } else if (d.teamApplyStatus == 2) {
                                return '待缴费'
                            } else if (d.teamApplyStatus == 4) {
                                return '报名成功'
                            } else if (d.teamApplyStatus == 3) {
                                return '已缴费'
                            } else if (d.teamApplyStatus == 0) {
                                return '已拒绝'
                            }
                        }
                    },
                    {
                        fixed: 'right',
                        title: "操作",
                        width: 200,
                        align: 'center',
                        toolbar: '#barDemo2'
                    }
                ]
            ],
            id: 'testReload',
            done: function (res) {
                console.log(res)
                if (res.msg == "2") {
                    parent.window.location.href = getRequestPrefix() +
                        "/footBallAdmin/login.html"
                }
                layer.close(index)
            }
        });



        //监听点击的按钮，获取行信息
        table.on('tool(test)', function (obj) { //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
            //获得当前行数据
            var $ = layui.$
            var data = obj.data,
                layEvent = obj.event, //获得 lay-event 对应的值
                teamApplyId = data.teamApplyId;
            if (layEvent == 'approve') {
                layer.open({
                    content: "approveFailure.html",
                    type: 2,
                    area: ["600px", "250px"],
                    title: "审核申请",
                    shadeClose: true,
                    success: function (layero, index) {
                        //获取点击行的数据,获取打开的iframe
                        // console.log(data)
                        var body = layer.getChildFrame('body', index);
                        var iframeWin = window[layero.find('iframe')[0]['name']];
                        body.find('#id').attr("data-id", data.teamApplyId); //填补ID
                    }
                })
            }

            if (layEvent == 'confirmPay') {
                layer.confirm("确认已收到保证金？", function (index) {
                    $.ajax({
                        url: ConfirmationPayment,
                        type: 'get',
                        data: {
                            teamApplyId: teamApplyId,
                        },
                        dataType: 'json',
                        success: function (data) {
                            console.log(data)
                            if (data.msg == 0) {
                                layer.alert("确认收款", {
                                    title: "提示"
                                });
                                table.reload("testReload");
                            } else {
                                layer.alert(data.msg, {
                                    title: '提示'
                                })
                            }
                        },
                        error: function (data) {
                            console.log(data)
                            layer.alert(data.msg, {
                                title: '提示'
                            })
                        }
                    });
                    layer.close(index)
                })
            }
        });
    });
</script>